<template>
	<div id="XSDFXPage" class="XSDFXPage"></div>
</template>
<script src="echarts"></script>  
<script src="echarts/extension/bmap/bmap.js"></script>  
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.js"></script>

<script>
// import echarts from "echarts";
// import bmap from 'echarts/extension/bmap/bmap'
	export default {
		name:'',
		data () {
			return {
				myChart:null
			}
		},
		mounted() {
		var 	option = {
							bmap: {  
							center: [113.65,34.76],  
							zoom: 5,  
							roam: true,  
							},   
							series: [{  
								type: 'map',  
								coordinateSystem: 'bmap'  
							}]  
				}
				var self = this
				 if(this.myChart){
		                this.myChart.clear()
                    this.myChart.dispose()
				}
				
				this.$nextTick(function(){
						setTimeout(() => {
							self.myChart = echarts.init(document.getElementById('XSDFXPage'))
						self.myChart.setOption(option)
						// 获取百度地图实例，使用百度地图自带的控件
						var bmap = this.myChart.getModel().getComponent('bmap').getBMap();
						bmap.addControl(new BMap.MapTypeControl());	
						
						}, 2000);
				})
				
				
			
		}
	}
</script>
<style scoped>
	html,body,.XSDFXPage{
			width: 100%;
			height: 100%;
			overflow: hidden;
			margin: 0;
			font-family: "微软雅黑";
		}
</style>  